<template>
	<view class="su-top-bar" :style="{position: fixed}">
		<navigator open-type="navigateBack" class="back">
			<text class="cuIcon-back_android icon"></text>
		</navigator>
		<view class="more">
			<navigator open-type="navigate" url="/pages/shopIndex/shop-my-order" class="back">
				<text class="cuIcon-cart icon"></text>
			</navigator>
			<navigator open-type="navigate" url="/pages/shopIndex/index" class="back">
				<text class="cuIcon-home icon"></text>
			</navigator>
		</view>
		
		<!--<navigator open-type="navigateBack" class="back">
			<text class="cuIcon-back_android icon"></text>
		</navigator>
		<view class="more">
			<navigator open-type="switchTab" url="/pages/index/index-my-order" class="back">
				<text class="cuIcon-cart icon"></text>
			</navigator>
			<navigator open-type="switchTab" url="/pages/index/index" class="back">
				<text class="cuIcon-home icon"></text>
			</navigator>
		</view>-->
	</view>
</template>

<script>
		import conf from '@/conf/config.js';
	export default {
		data() {
			return {
				
			}
		},
		props: {
			fixed: {
				type: String
			}
		},
		methods: {
		}
	}
</script>

<style lang="less" scoped>
	/* su-top-bar style ! */
	.su-top-bar {
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 9;
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0 12rpx;
	}
	.su-top-bar .more {
		display: flex;
	}
	.su-top-bar .back {
		position: relative;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 50rpx;
		height: 50rpx;
		color: #FFF;
		font-size: 32rpx;
		margin: 20rpx 10rpx;
	}
	.su-top-bar .back:before {
		content: '';
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		display: block;
		opacity: 0.3;
		border-radius: 10rpx;
		background: #000;
	}
	.su-top-bar .icon {
		position: relative;
	}
</style>
